import React, { Component } from 'react';
import { InputItem,Button,List} from 'antd-mobile'
import { Link, RouteComponentProps } from 'react-router-dom';

interface IProps {
  add:Function,
  del:Function,
  changeInput:Function,
  list:string[],
  inputValue:string
}
class todoListUi extends Component<IProps,any> {
  constructor(props:any){
    super(props);
    console.log(this.props)
  }
  render() {
    let {changeInput ,add,del,list}=this.props;
    return (
      <div>
        <InputItem type='text' onChange={(value)=>{changeInput(value)}}></InputItem>
        <Button onClick={()=>{add()}}>添加</Button>
        {
          list.map((item,index)=>{
            return (<Button key={index} onClick={()=>{del(index)}}>{item}</Button>)
          })
        }
      </div>
    );
  }
}

export default todoListUi;